<template>
  <div class="SendOutManagement-container">
    <!-- 栅格 输入框 和按钮 -->
    <el-row class="filterCondition">
      <el-radio-group v-model="tabPosition" @change="ChangeTab" style="margin: 10px;">
        <el-radio-button label="分公司配置">分公司配置</el-radio-button>
        <el-radio-button label="来源供量控制">来源供量控制</el-radio-button>
      </el-radio-group>
      <br />
      <el-form
        label-width="82px"
        label-position="right"
        ref="formLabelAlign"
        :model="formLabelAlign"
        v-show="!ShowSourceSet"
      >
        <el-form-item prop="city" label="城市" v-if="ShowCity">
          <el-select v-model="formLabelAlign.city" @change="getCompany" placeholder="请选择城市">
            <el-option label="所有" value></el-option>
            <el-option
              v-for="item in cityselectList"
              :key="item.city"
              :label="item.city"
              :value="item.city"
            ></el-option>
          </el-select>
        </el-form-item>
        <el-form-item label="分公司">
          <el-select v-model="formLabelAlign.id" placeholder="请选择分公司">
            <el-option label="全部" value></el-option>
            <el-option
              v-for="item in fenselectList"
              :key="item.id"
              :label="item.name"
              :value="item.id"
            ></el-option>
          </el-select>
        </el-form-item>
        <el-form-item prop="supplyType" label="外发类型">
          <el-select v-model="formLabelAlign.supplyType" placeholder="请选择外发类型">
            <el-option label="全部" value></el-option>
            <el-option label="单独外发" value="1"></el-option>
            <el-option label="共享外发" value="2"></el-option>
          </el-select>
        </el-form-item>
        <el-form-item prop="isNeedData" label="数据开关">
          <el-select v-model="formLabelAlign.isNeedData" placeholder="请选择数据开关">
            <el-option label="全部" value></el-option>
            <el-option label="开" value="true"></el-option>
            <el-option label="关" value="false"></el-option>
          </el-select>
        </el-form-item>
        <el-form-item class="BTN">
          <el-button
            style="background-color:#c73e3a;color:#fff"
            @click="checkCus"
            class="check"
            :disabled="disTBN"
          >查询</el-button>
          <el-button
            style="background-color:	#11bccd;color:#fff"
            @click="ShowAddFGS()"
            class="check"
          >新增分公司</el-button>
        </el-form-item>
      </el-form>
      <!-- 来源搜索条件面板 -->
      <el-form
        label-width="82px"
        label-position="right"
        ref="formLabelAlign"
        :model="formLabelAlign"
        v-show="ShowSourceSet"
      >
        <!-- <el-form-item label="渠道">
          <el-select v-model="formLabelAlign.laiYuan" placeholder="渠道">
            <el-option
              v-for="item in laiYuanList"
              :key="item.id"
              :label="item.name"
              :value="item.id"
            ></el-option>
          </el-select>
        </el-form-item>-->
        <el-autocomplete
          popper-class="my-autocomplete"
          v-model="formLabelAlign.LinShiData"
          :fetch-suggestions="querySearch"
          placeholder="请输入平台"
          @select="handleSelect"
          style="margin-left:10px"
        >
          <i class="el-icon-edit el-input__icon" slot="suffix" @click="handleIconClick"></i>
          <template slot-scope="{ item }">
            <div class="name">{{ item.sourceName2 }}</div>
            <!-- <span class="addr" style="font-size: 12px; color: #b4b4b4;">{{ item.address }}</span> -->
          </template>
        </el-autocomplete>
        <el-form-item label="分公司">
          <el-select v-model="formLabelAlign.wfId" placeholder="请选择分公司">
            <el-option label="全部" value></el-option>
            <el-option
              v-for="item in fenselectList"
              :key="item.id"
              :label="item.name"
              :value="item.id"
            ></el-option>
          </el-select>
        </el-form-item>
        <el-form-item class="BTN">
          <el-button
            style="background-color:#c73e3a;color:#fff"
            @click="checkSouce"
            class="check"
            :disabled="disTBN"
          >查询</el-button>
        </el-form-item>
      </el-form>
    </el-row>
    <!-- table1 -->
    <el-table :data="tableData" style="width: 100%" v-loading="loading" v-show="!ShowSourceSet">
      <el-table-column prop="city" label="城市"></el-table-column>
      <el-table-column prop="name" label="分公司名"></el-table-column>
      <el-table-column label="数据开关">
        <template slot-scope="scope">{{ scope.row.isNeedData | panDuanKG}}</template>
      </el-table-column>
      <el-table-column prop="upperLimit" label="当日数据上限"></el-table-column>
      <el-table-column label="外发类型">
        <template slot-scope="scope">{{ scope.row.supplyType | panDuanWFXL}}</template>
      </el-table-column>
      <el-table-column label="外发组">
        <template slot-scope="scope">{{ scope.row.supplyName }}</template>
      </el-table-column>
      <el-table-column label="使用状态">
        <template slot-scope="scope">
          <el-switch
            active-text="开启"
            inactive-text="禁止"
            on-color="#5B7BFA"
            off-color="#dadde5"
            v-model="scope.row.disable"
            @change="changeSwitch(scope.$index,scope.row)"
          ></el-switch>
        </template>
      </el-table-column>
      <el-table-column label="禁止分发时间">
        <template slot-scope="scope">
          <p class="ell" @click="mydistribution(scope.row.id,scope.row.week)">{{ scope.row.week}}</p>
          <p class="ell" v-show="!scope.row.week" @click="mydistribution(scope.row.id)">无</p>
        </template>
      </el-table-column>
      <el-table-column label="操作">
        <template slot-scope="scope">
          <el-button type="primary" size="small" @click="EditSendOut(scope.row)">编辑</el-button>
        </template>
      </el-table-column>
    </el-table>
    <!-- 分页1 -->
    <el-pagination
      @size-change="handleSizeChange"
      @current-change="handleCurrentChange"
      :current-page="pageConfig.currentPage"
      v-show="!ShowSourceSet"
      :page-sizes="[10, 20 ,50, 100]"
      :page-size="pageConfig.pageSize"
      layout="total, sizes, prev, pager, next, jumper"
      :total="pageConfig.total"
    ></el-pagination>
    <!-- table2 -->
    <el-table :data="SoucetableData" style="width: 100%" v-loading="loading" v-show="ShowSourceSet">
      <el-table-column prop="sourceName2" label="渠道" width="200"></el-table-column>
      <el-table-column prop="name" label="来源" width="200"></el-table-column>
      <el-table-column label="供量分公司">
        <template slot-scope="scope">
          <p
            class="ell"
            @click="ShoGLTCDetail(scope.row.id)"
          >{{ scope.row.wfNameS | panDuanFeiKong}}</p>
        </template>
      </el-table-column>
      <el-table-column prop="updateTime" label="操作时间">
        <template slot-scope="scope">{{scope.row.updateTime | formatTime}}</template>
        <!-- {{ "2020-03-26 00:00:00"}} -->
      </el-table-column>
    </el-table>
    <!-- 分页2 -->
    <el-pagination
      @size-change="SoucehandleSizeChange"
      @current-change="SoucehandleCurrentChange"
      :current-page="SoucepageConfig.currentPage"
      v-show="ShowSourceSet"
      :page-sizes="[10, 20 ,50, 100]"
      :page-size="SoucepageConfig.pageSize"
      layout="total, sizes, prev, pager, next, jumper"
      :total="SoucepageConfig.total"
    ></el-pagination>
    <!-- 新增/编辑分公司弹框1 -->
    <el-dialog title="新增/编辑分公司" :modal-append-to-body="false" :visible.sync="ShowXBFGS">
      <el-form :model="ZengBianForm" label-position="right">
        <el-form-item label="城市" :label-width="formLabelWidth">
          <el-input v-model="ZengBianForm.city" autocomplete="off" type="text"></el-input>
        </el-form-item>
        <el-form-item label="分公司名称" :label-width="formLabelWidth">
          <el-input v-model="ZengBianForm.name" autocomplete="off" type="text"></el-input>
        </el-form-item>
        <el-form-item label="数据开关" :label-width="formLabelWidth">
          <el-select v-model="ZengBianForm.isNeedData" placeholder="请数据开关状态">
            <el-option
              v-for="item in isNeedDataList"
              :key="item.id"
              :label="item.name"
              :value="item.id"
            ></el-option>
          </el-select>
        </el-form-item>
        <el-form-item label="当日数据上限" :label-width="formLabelWidth">
          <el-input v-model="ZengBianForm.upperLimit" autocomplete="off" type="number">
            <i slot="suffix">/条</i>
          </el-input>
        </el-form-item>
        <el-form-item label="外发组" :label-width="formLabelWidth">
          <el-select v-model="ZengBianForm.foreignId" placeholder="请选择外发组">
            <el-option
              v-for="item in AllWaiFaList"
              :key="item.id"
              :label="item.supplyName"
              :value="item.id"
            ></el-option>
          </el-select>
        </el-form-item>
        <el-form-item label :label-width="formLabelWidth">
          无外发组？
          <a href="javascript:void(0);" style="text-decoration:none;" @click="ShowAddWaiFa">点此新增外发组</a>
        </el-form-item>
      </el-form>
      <div slot="footer" class="dialog-footer">
        <el-button @click="ShowXBFGS = false">取 消</el-button>
        <el-button type="primary" v-show="ShowXZBTN" @click="addZengBian">新 增</el-button>
        <el-button type="primary" v-show="!ShowXZBTN" @click="ConformEdit">确 定</el-button>
      </div>
    </el-dialog>
    <!-- 新增外发组弹框2 -->
    <el-dialog title="新增外发组" id="XZWaiFaid" :visible.sync="ShowAddGroup">
      <el-form :model="ZengWaiFaForm" label-position="right">
        <el-form-item label="城市" :label-width="formLabelWidth">
          <el-input v-model="ZengWaiFaForm.city" autocomplete="off" type="text"></el-input>
        </el-form-item>
        <el-form-item label="外发类型" :label-width="formLabelWidth">
          <el-select v-model="ZengWaiFaForm.supplyType" placeholder="请选择外发类型">
            <el-option label="单独外发" value="1"></el-option>
            <el-option label="共享外发" value="2"></el-option>
          </el-select>
        </el-form-item>
        <el-form-item label="外发组名称" :label-width="formLabelWidth">
          <el-input v-model="ZengWaiFaForm.supplyName" autocomplete="off" type="text"></el-input>
        </el-form-item>
        <!-- 外发组排序 暂不需要 -->
        <!-- <el-form-item label="外发组排序" :label-width="formLabelWidth" >
          <el-input v-model="ZengWaiFaForm.paixu" autocomplete="off" type="text"></el-input>
        </el-form-item>-->
      </el-form>
      <div slot="footer" class="dialog-footer">
        <el-button @click="ShowAddGroup = false;ShowXBFGS = true">返 回</el-button>
        <el-button type="primary" @click="addWaiFaZu">确 定</el-button>
      </div>
    </el-dialog>
    <!-- 供量分公司弹窗 -->
    <el-dialog
      title="选择供量分公司"
      :visible.sync="ShoGLDetail"
      :modal-append-to-body="false"
      width="30%"
    >
      <div style="height:10px;margin-bottom:20px">
        <p style="color:red;margin:0;font-size:12px">*请谨慎勾选</p>
      </div>
      <div id="bigBox" style="display:flex">
        <el-checkbox
          :indeterminate="isIndeterminate"
          v-model="checkAll2"
          @change="handleCheckAllChange"
        >全选</el-checkbox>
        <div class="duoxuankuang" style="display:inline">
          <el-checkbox-group v-model="checkedCities2" @change="handleCheckedCitiesChange">
            <el-checkbox v-for="city2 in cities2" :label="city2" :key="city2">{{city2}}</el-checkbox>
          </el-checkbox-group>
        </div>
      </div>
      <span slot="footer" class="dialog-footer">
        <el-button @click="ShoGLDetail = false">取 消</el-button>
        <el-button type="primary" @click="updateWaiFa">确 定</el-button>
      </span>
    </el-dialog>
    <!-- 静止分发时间 -->
    <el-dialog
      title="禁止分发时间"
      :visible.sync="distribution"
      :modal-append-to-body="false"
      width="30%"
    >
      <div style="height:10px;margin-bottom:20px">
        <p style="color:red;margin:0;font-size:12px">*请谨慎勾选</p>
      </div>
      <div id="bigBox" style="display:flex">
        <!-- <el-checkbox :indeterminate="isIndeterminate" v-model="checkAll2" @change="handleCheckAllChange">全选</el-checkbox> -->
        <div class="duoxuankuang" style="display:inline">
          <!-- <el-checkbox-group v-model="checkedCities2" @change="handleCheckedCitiesChange">
            <el-checkbox v-for="city2 in cities2" :label="city2" :key="city2">{{city2}}</el-checkbox>
          </el-checkbox-group>-->
          <el-checkbox-group v-model="checkList">
            <el-checkbox label="星期一"></el-checkbox>
            <el-checkbox label="星期二"></el-checkbox>
            <el-checkbox label="星期三"></el-checkbox>
            <el-checkbox label="星期四"></el-checkbox>
            <el-checkbox label="星期五"></el-checkbox>
            <el-checkbox label="星期六"></el-checkbox>
            <el-checkbox label="星期日"></el-checkbox>
          </el-checkbox-group>
        </div>
      </div>
      <span slot="footer" class="dialog-footer">
        <el-button @click="distribution = false">取 消</el-button>
        <el-button type="primary" @click="updatestop">确 定</el-button>
      </span>
    </el-dialog>
  </div>
</template>

<script>
// 导入时间戳
import moment from "moment";
export default {
  name: "SendOutManagement",
  // 数据
  data() {
    return {
      //测试数据开始
      checkAll2: false,
      checkedCities2: [],
      cities2: [],
      isIndeterminate: true,
      //测试数据结束
      cityList: [], //城市列表
      checkedCity: [],
      checkAll: false,
      cityId: [], //城市ID
      wfIdsList: [], //存贮分公司id的数组
      wfNameSList: [], //存储分公司的数组
      PinTaiList: [],
      LinshiWaiFaId: "",
      currentUser: {
        currentName: "",
        currentId: "",
        currentLevel: "",
        currentPhone: "",
        currentcity: ""
      },
      checkList: [],
      ShowCity: false,
      ShoGLDetail: false, //供量分公司弹窗
      distribution: false, //静止分发弹窗
      ShowXBFGS: false,
      ShowAddGroup: false,
      //收款银行动态生成内容
      bankList: [],
      showTimeKind: true,
      loading: true,
      tabPosition: "分公司配置",
      //禁用按钮的状态值
      disTBN: false,
      ShowXZBTN: false,
      ShowSourceSet: false,
      formLabelWidth: "180px",
      //分公司动态生成内容
      fenselectList: [{ id: 0, name: "请先选择上一级" }],
      //页码参数
      pageConfig: {
        currentPage: 1, //当前页
        pageSize: 10, //当前单页数据条数
        total: 0 //请求到的数据总条数
      },
      SoucepageConfig: {
        currentPage: 1, //当前页
        pageSize: 10, //当前单页数据条数
        total: 0 //请求到的数据总条数
      },
      cityselectList: [],
      AllWaiFaList: [], //所有外发组列表
      isNeedDataList: [
        { id: true, name: "开" },
        { id: false, name: "关" }
      ],
      cengJiList: [
        { id: "fenGS", name: "分公司" },
        { id: "quyu", name: "大区" },
        { id: "bumen", name: "部门" },
        { id: "guwen", name: "顾问" }
      ],
      laiYuanList: [],
      //筛选区域数据
      formLabelAlign: {
        supplyType: "", //	外发类型
        city: "", //	城市
        id: "", // 外发公司id
        isNeedData: "",
        Souce: "",
        FenGS: "",
        hasValue: "",
        pinTaiId: "",
        hzType: "",
        pageSize: "",
        currentPage: "",
        LinShiData: "",
        wfId: "", //来源供量控制 分公司的值
        laiYuan: "", //关键字
        pageSize: "", //分页大小
        currentPage: "" //	当前页码
      },
      //新增、编辑弹窗数据1
      ZengBianForm: {
        city: "", //城市
        id: "", //id
        name: "", //分公司
        upperLimit: "", //	当日上限
        isNeedData: "", //数据开关
        foreignId: "" // 外发组
      },
      //新增分组弹窗数据2
      ZengWaiFaForm: {
        city: "",
        supplyName: "", //外发名称
        supplyType: "", //外发类型
        paixu: "123" //分公司 新版
      },
      tableData: [],
      SoucetableData: []
    };
  },
  methods: {
    //获取全部选中城市
    handleCheckAllChange(val) {
      this.checkedCities2 = val ? this.cities2 : [];
      this.isIndeterminate = false;
    },
    //获取选中城市
    handleCheckedCitiesChange(value) {
      let checkedCount = value.length;
      this.checkAll = checkedCount === this.cities2.length;
      this.isIndeterminate =
        checkedCount > 0 && checkedCount < this.cities2.length;
    },
    updateWaiFa() {
      let wfIds = [];
      if (this.checkedCities2.length != 0) {
        for (let i = 0; i < this.checkedCities2.length; i++) {
          for (let j = 0; j < this.cityList.length; j++) {
            if (this.checkedCities2[i] == this.cityList[j].name) {
              wfIds.push(this.cityList[j].id);
            }
          }
        }
      } else {
        wfIds = [];
      }
      this.$axios
        .get(
          `/spider/source/updateWfIds?id=${this.LinshiWaiFaId}&wfIds=${wfIds}&wfNameS=${this.checkedCities2}`
        )
        .then(res => {
          if (res.data.messageModel.code == 0) {
            this.$message.success("编辑成功！");
            this.checkSouce();
            this.ShoGLDetail = false;
          } else {
            this.$message.error(res.data.messageModel.messageText);
            this.ShoGLDetail = false;
          }
        })
        .catch(error => {
          console.log(error);
        });
    },
    mydistribution(id,str) {
      
      this.LinshiWaiFaId = id //随便拿渠道供量的中间变量 0-0
      this.checkList = str.split(",")
      this.distribution = true;
    },
    // 禁止分发时间 提交键
    updatestop() {
      this.$axios.get(`/spider/WfDepartment/updateByWeek?id=${this.LinshiWaiFaId}&week=${this.checkList.toString()}`)
      this.getWaiFaList()
      this.distribution = false;
    },
    //请求渠道供量的分公司
    ShoGLTCDetail(id) {
      this.LinshiWaiFaId = id;
      this.$axios
        .get(`/spider/WfDepartment/getAllDepartment`)
        .then(res => {
          if (res.data.messageModel.code == 0) {
            this.cityList = res.data.dataModel; //提交时需要遍历获取ID的集合
            this.cities2 = [];
            for (let i = 0; i < res.data.dataModel.length; i++) {
              this.cities2.push(res.data.dataModel[i].name);
            }
          } else {
            this.$message.error(res.data.messageModel.messageText);
            return false;
          }
        })
        .catch(error => {
          console.log(error);
        });
      //渲染已选择的分公司
      this.$axios
        .get(`/spider/source/selById?id=${id}`)
        .then(res => {
          if (res.data.messageModel.code == 0) {
            if (
              res.data.dataModel.wfIds != "" &&
              res.data.dataModel.wfNameS != ""
            ) {
              this.wfIdsList = res.data.dataModel.wfIds.split(",");
              this.wfNameSList = res.data.dataModel.wfNameS.split(",");
              this.checkedCities2 = res.data.dataModel.wfNameS.split(",");
              this.checkedCity = [];
              for (let i = 0; i < this.wfNameSList.length; i++) {
                var obj = {};
                obj.name = this.wfNameSList[i];
                obj.id = this.wfIdsList[i];
                this.checkedCity.push(obj);
              }
            } else {
              this.checkedCity = [];
            }
          } else {
            this.$message.error(res.data.messageModel.messageText);
          }
        })
        .catch(error => {
          console.log(error);
        });
      this.ShoGLDetail = true;
    },
    //外发List的方法
    getWaiFaList() {
      this.$axios
        .get(
          `/spider/WfDepartment/selDepartment?city=${this.formLabelAlign.city}&id=${this.formLabelAlign.id}&supplyType=${this.formLabelAlign.supplyType}&isNeedData=${this.formLabelAlign.isNeedData}&currentPage=${this.pageConfig.currentPage}&pageSize=${this.pageConfig.pageSize}`
        )
        .then(res => {
          if (res.data.messageModel.code == 0) {
            this.tableData = res.data.dataModel.list;
            this.pageConfig.total = res.data.dataModel.total;
            this.loading = false;
          } else {
            this.$message.error(res.data.messageModel.messageText);
            this.tableData = [];
            this.pageConfig.total = 0;
            this.loading = false;
          }
        })
        .catch(error => {
          console.log(error);
        });
    },
    //外发List的方法
    getSouceList() {
      //后端要求wfId为空时 不能传wfId这个KEY！！！！！！！！！！！！！
      if (this.formLabelAlign.wfId == "") {
        this.$axios
          .get(
            `/spider/source/getSourceList?pinTaiId=${this.formLabelAlign.pinTaiId}&currentPage=${this.SoucepageConfig.currentPage}&pageSize=${this.SoucepageConfig.pageSize}`
          )
          .then(res => {
            if (res.data.messageModel.code == 0) {
              this.SoucetableData = res.data.dataModel.list;
              this.SoucepageConfig.total = res.data.dataModel.total;
              this.loading = false;
            } else {
              this.$message.error(res.data.messageModel.messageText);
              this.SoucetableData = [];
              this.SoucepageConfig.total = 0;
              this.loading = false;
            }
          });
      } else {
        this.$axios
          .get(
            `/spider/source/getSourceList?pinTaiId=${this.formLabelAlign.pinTaiId}&wfId=${this.formLabelAlign.wfId}&currentPage=${this.SoucepageConfig.currentPage}&pageSize=${this.SoucepageConfig.pageSize}`
          )
          .then(res => {
            if (res.data.messageModel.code == 0) {
              this.SoucetableData = res.data.dataModel.list;
              this.SoucepageConfig.total = res.data.dataModel.total;
              this.loading = false;
            } else {
              this.$message.error(res.data.messageModel.messageText);
              this.SoucetableData = [];
              this.SoucepageConfig.total = 0;
              this.loading = false;
            }
          })
          .catch(error => {
            console.log(error);
          });
      }
    },
    //清空所有筛选条件的方法
    clearAllCheck() {
      for (let i = 0; i < this.formLabelAlign.length; i++) {
        this.formLabelAlign.formLabelAlign[i] = "";
      }
    },
    //将按钮禁用两秒
    disButton() {
      this.disTBN = true;
      setTimeout(() => {
        this.disTBN = false;
      }, 2000);
    },
    //分页的方法
    handleSizeChange(val) {
      if (this.pageConfig.currentPage != 1) {
        this.pageConfig.currentPage = 1;
        this.pageConfig.pageSize = val;
        this.getWaiFaList();
      } else {
        this.pageConfig.pageSize = val;
        this.getWaiFaList();
      }
    },
    handleCurrentChange(val) {
      this.pageConfig.currentPage = val;
      this.getWaiFaList();
    },
    SoucehandleSizeChange(val) {
      if (this.SoucepageConfig.currentPage != 1) {
        this.SoucepageConfig.currentPage = 1;
        this.SoucepageConfig.pageSize = val;
        this.getSouceList();
      } else {
        this.SoucepageConfig.pageSize = val;
        this.getSouceList();
      }
    },
    SoucehandleCurrentChange(val) {
      this.SoucepageConfig.currentPage = val;
      this.getSouceList();
    },
    //显示分公司弹窗
    ShowAddFGS() {
      //新增先清空表单
      for (let key in this.ZengBianForm) {
        this.ZengBianForm[key] = "";
      }
      this.getAllWaiFa(); //刷新弹窗中 外发下拉框的值
      this.getWaiFaList(); //临时解决table首行数据被清空的问题  下下策！！！！！！
      this.ShowXZBTN = true;
      this.ShowXBFGS = true;
    },
    //显示新增外发组弹窗
    ShowAddWaiFa() {
      //新增先清空表单
      for (let key in this.ZengWaiFaForm) {
        this.ZengWaiFaForm[key] = "";
      }
      this.ShowXBFGS = false;
      this.ShowAddGroup = true;
    },
    //确认新增分公司
    addZengBian() {
      //非空判断
      if (this.ZengBianForm.city == "") {
        this.$message.error("请填写城市");
        return false;
      }
      if (this.ZengBianForm.name == "") {
        this.$message.error("请填写分公司名称");
        return false;
      }
      if (this.ZengBianForm.isNeedData === "") {
        this.$message.error("请选择数据开关");
        return false;
      }
      if (this.ZengBianForm.upperLimit === "") {
        this.$message.error("请填写数据上限");
        return false;
      }
      if (this.ZengBianForm.upperLimit <= 0) {
        this.$message.error("请填写数据上限不能小于等于0");
        return false;
      }
      if (this.ZengBianForm.foreignId === "") {
        this.$message.error("请选择外发组");
        return false;
      }
      this.$axios
        .get(
          `/spider/WfDepartment/addDepartment?city=${this.ZengBianForm.city}&name=${this.ZengBianForm.name}&upperLimit=${this.ZengBianForm.upperLimit}&isNeedData=${this.ZengBianForm.isNeedData}&foreignId=${this.ZengBianForm.foreignId}`
        )
        .then(res => {
          if (res.data.messageModel.code == 0) {
            this.ShowXBFGS = false;
            this.$message.success("添加成功(#^.^#)");
            this.getWaiFaList();
          } else {
            this.$message.error(res.data.messageModel.messageText);
          }
        })
        .catch(error => {
          console.log(error);
        });
    },
    //确认编辑
    ConformEdit() {
      //非空判断
      if (this.ZengBianForm.city == "") {
        this.$message.error("请填写城市");
        return false;
      }
      if (this.ZengBianForm.name == "") {
        this.$message.error("请填写分公司名称");
        return false;
      }
      if (this.ZengBianForm.isNeedData === "") {
        this.$message.error("请选择数据开关");
        return false;
      }
      if (this.ZengBianForm.upperLimit === "") {
        this.$message.error("请填写数据上限");
        return false;
      }
      if (this.ZengBianForm.upperLimit <= 0) {
        this.$message.error("请填写数据上限不能小于等于0");
        return false;
      }
      if (this.ZengBianForm.foreignId === "") {
        this.$message.error("请选择外发组");
        return false;
      }
      this.$axios
        .get(
          `/spider/WfDepartment/updateDepartment?city=${this.ZengBianForm.city}&name=${this.ZengBianForm.name}&upperLimit=${this.ZengBianForm.upperLimit}&isNeedData=${this.ZengBianForm.isNeedData}&foreignId=${this.ZengBianForm.foreignId}&id=${this.ZengBianForm.id}`
        )
        .then(res => {
          if (res.data.messageModel.code == 0) {
            this.ShowXBFGS = false;
            this.$message.success("修改成功(#^.^#)");
            this.getWaiFaList();
          } else {
            this.$message.error(res.data.messageModel.messageText);
          }
        })
        .catch(error => {
          console.log(error);
        });
    },
    //获取分公司数据
    GetFengGS() {
      this.$axios
        .get(`/spider/WfDepartment/getAllDepartment`)
        .then(res => {
          this.fenselectList = res.data.dataModel;
        })
        .catch(error => {
          console.log(error);
        });
      this.loading = false;
    },
    //根据城市获取分公司数据
    getCompany(vId) {
      if (this.formLabelAlign.city != "") {
        let obj = {};
        obj = this.cityselectList.find(item => {
          return item.city === vId; //筛选出匹配数据
        });
        // 清空分公司列表
        this.fenselectList = [];
        // 再通过城市获取分公司列表
        this.$axios
          .get(`/spider/WfDepartment/getAllDepartment?city=${obj.city}`)
          .then(res => {
            this.fenselectList = res.data.dataModel;
          })
          .catch(error => {
            console.log(error);
          });
      } else {
        this.$axios
          .get(`/spider/WfDepartment/getAllDepartment`)
          .then(res => {
            this.fenselectList = res.data.dataModel;
          })
          .catch(error => {
            console.log(error);
          });
      }
    },
    //新增外发组
    addWaiFaZu() {
      //非空判断
      this.ZengWaiFaForm.paixu = "1"; //为非空判断的临时处理
      for (let key in this.ZengWaiFaForm) {
        if (this.ZengWaiFaForm[key] == "") {
          this.$message.error("请完善新增内容");
          return false;
        }
      }
      this.$axios
        .get(
          `/spider/WfDepartment/addForeign?city=${this.ZengWaiFaForm.city}&supplyType=${this.ZengWaiFaForm.supplyType}&supplyName=${this.ZengWaiFaForm.supplyName}`
        )
        .then(res => {
          if (res.data.messageModel.code == 0) {
            this.ShowAddGroup = false;
            this.getAllWaiFa(); //重新获取外发组列表
            this.getWaiFaList();
            this.ShowXBFGS = true; //显示新增/编辑弹框
            this.$message.success("外发添加成功(#^.^#)");
          } else {
            this.$message.error(res.data.messageModel.messageText);
          }
        })
        .catch(error => {
          console.log(error);
        });
    },
    //获取所有外发
    getAllWaiFa() {
      this.$axios
        .get(`/spider/WfDepartment/selForeign`)
        .then(res => {
          if (res.data.messageModel.code == 0) {
            this.AllWaiFaList = res.data.dataModel;
          } else {
            this.$message.error(res.data.messageModel.messageText);
            this.AllWaiFaList = [];
          }
        })
        .catch(error => {
          console.log(error);
        });
    },
    //获取所有城市的方法
    getAllCity() {
      this.$axios
        .get(`/spider/WfDepartment/selAllCity`)
        .then(res => {
          if (res.data.messageModel.code == 0) {
            // console.log(res.data.dataModel);
            this.cityselectList = res.data.dataModel;
          } else {
            this.$message.error(res.data.messageModel.messageText);
            this.cityselectList = [];
          }
        })
        .catch(error => {
          console.log(error);
        });
    },
    //判断tab的变化
    ChangeTab(val) {
      if (val == "分公司配置") {
        this.ShowSourceSet = false;
        this.getWaiFaList();
      } else {
        //请求渠道可选
        this.getQudaoList();
        this.ShowSourceSet = true;
        this.getSouceList();
        this.loadAll();
      }
    },
    //获取渠道的下拉列表
    getQudaoList() {
      //getSourceList
      this.$axios
        .get(`/spider/source/getSourceByType?type=1`)
        .then(res => {
          this.laiYuanList = res.data.dataModel;
        })
        .catch(error => {
          console.log(error);
        });
    },
    //查询
    checkCus() {
      this.disButton();
      this.loading = true;
      this.getWaiFaList();
    },
    //查询来源
    checkSouce() {
      if (this.formLabelAlign.LinShiData == "") {
        this.formLabelAlign.pinTaiId = "";
      }
      this.disButton();
      this.loading = true;
      this.getSouceList();
    },
    //改变开关的状态
    changeSwitch(index, row) {
      this.$axios
        .get(
          `/spider/WfDepartment/updateDepartment?id=${row.id}&city=${row.city}&name=${row.name}&upperLimit=${row.upperLimit}&isNeedData=${row.isNeedData}&foreignId=${row.foreignId}&disable=${row.disable}`
        )
        .then(res => {
          if (res.data.messageModel.code == 0) {
            this.ShowXBFGS = false;
            if (row.disable == true || row.disable == "true") {
              this.$message.success("开关已开启");
            } else {
              this.$message.success("开关已关闭");
            }
            this.getWaiFaList();
          } else {
            this.$message.error(res.data.messageModel.messageText);
          }
        })
        .catch(error => {
          console.log(error);
        });
    },
    //编辑
    EditSendOut(row) {
      // console.log(row);
      this.ZengBianForm = row;
      this.getAllWaiFa();
      this.getWaiFaList(); //临时解决table首行数据被清空的问题  下下策！！！！！！
      this.ShowXZBTN = false;
      this.ShowXBFGS = true;
    },
    querySearch(queryString, cb) {
      var PinTaiList = this.PinTaiList;
      var results = queryString
        ? PinTaiList.filter(this.createFilter(queryString))
        : PinTaiList;
      // 调用 callback 返回建议列表的数据
      cb(results);
    },
    createFilter(queryString) {
      return restaurant => {
        return (
          restaurant.sourceName2
            .toLowerCase()
            .indexOf(queryString.toLowerCase()) === 0
        );
      };
    },
    loadAll() {
      this.$axios
        .get(
          `/spider/source/getSourceList?pageSize=1000&currentPage=1&hasValue=ABC`
        )
        .then(res => {
          if (res.data.messageModel.code == 0) {
            this.PinTaiList = res.data.dataModel.list;
          } else {
            this.$message.error(res.data.messageModel.messageText);
          }
          return res.data.dataModel.list;
        });
    },
    handleSelect(item) {
      this.formLabelAlign.LinShiData = item.sourceName2;
      this.formLabelAlign.pinTaiId = item.id;
    },
    handleIconClick(ev) {
      // console.log(ev);
    }
  },
  mounted() {
    this.PinTaiList = this.loadAll();
  },
  // 本地过滤器
  filters: {
    formatTime(value) {
      if (value == null) {
        return "";
      }
      // return moment(value).format("YYYY-MM-DD HH:mm:ss");
      return moment(value).format("YY-MM-DD");
    },
    panDuanKG(val) {
      if (val == true || val == "true") {
        return "开";
      } else if (val == false || val == "false") {
        return "关";
      } else {
        return val;
      }
    },
    panDuanFeiKong(val) {
      if (val == null || val == "") {
        return "無";
      } else {
        return val;
      }
    },
    panDuanWFXL(val) {
      if (val == 1 || val == "1") {
        return "单独外发";
      } else if (val == 2 || val == "2") {
        return "共享外发";
      } else {
        return val;
      }
    }
  },
  created() {
    // if (window.sessionStorage.getItem("prohibitLogin") == "true") {
    this.currentUser.currentName = window.sessionStorage.getItem("name");
    this.currentUser.currentid = window.sessionStorage.getItem("id");
    this.currentUser.currentLevel = window.sessionStorage.getItem("userLevel");
    this.currentUser.currentcity = window.sessionStorage.getItem(
      "departmentName1"
    );
    if (
      (this.currentUser.currentLevel == 0 &&
        this.currentUser.currentcity == "null") ||
      (this.currentUser.currentLevel == 10 &&
        this.currentUser.currentcity == "null")
    ) {
      this.formLabelAlign.city = "";
      this.ShowCity = true;
      this.getWaiFaList();
    } else {
      // this.formLabelAlign.city = this.currentUser.currentcity
      this.getWaiFaList();
    }
    //获取分公司
    this.GetFengGS();
    //获取所有城市
    this.getAllCity();
    //请求渠道可选
    this.getQudaoList();
  }
};
</script>

<style  lang='scss'>
.SendOutManagement-container {
  // margin-top: 10px;
  .el-form-item.BTN {
    /deep/.el-form-item__content {
      margin-left: 20px !important;
    }
  }
  input.el-input__inner {
    width: 170px;
    height: 32px;
    padding-left: 10px;
  }
  #XZWaiFaid .el-dialog__headerbtn {
    display: none;
  }
  .el-dialog {
    .el-dialog__header {
      padding: 20px 20px 0;
    }
    .el-dialog__body {
      padding: 0px 20px 30px 20px;
    }
  }
  //突出隔行的颜色差异
  .el-table {
    font-size: 12px;
    .cell {
      padding-left: 1px;
      padding-right: 1px;
      text-align: center;
    }
    th {
      padding: 0;
    }
    .warning-row {
      background: #fff;
    }
    .success-row {
      background: #d3d3d3;
    }
    td {
      //取消单元格的上下padding
      padding: 2px 0;
      border-bottom: 1px solid rgb(211, 205, 205);
    }
    .el-button--mini {
      border: 0;
      padding: 5px 15px;
      margin: 5px 0;
      background: rgba(255, 255, 255, 0.01);
    }
    .toEdit:hover {
      color: skyblue;
    }
  }
  .my-autocomplete {
    li {
      line-height: normal;
      padding: 7px;

      .name {
        text-overflow: ellipsis;
        overflow: hidden;
      }
      .addr {
        font-size: 12px;
        color: #b4b4b4;
      }
      .highlighted .addr {
        color: #ddd;
      }
    }
  }
  // 时间分类框样式
  input.el-input__inner#kinds,
  /deep/input.el-input__inner#time {
    // width: 85px;
    padding-left: 7px;
    height: 32px !important;
  }
  // 日期选择器
  daterange.el-input,
  .el-date-editor--daterange.el-input__inner,
  .el-date-editor--timerange.el-input,
  .el-date-editor--timerange.el-input__inner {
    width: 240px;
    height: 36px;
    vertical-align: middle;
    .el-date-editor .el-range__icon {
      line-height: 27px;
    }
    .el-date-editor .el-range-separator {
      width: 5%;
    }
    /deep/.block,
    #block {
      border: none !important;
      /deep/.el-date-editor--daterange {
        width: 240px !important;
      }
    }
  }
  .el-form-item {
    display: inline-block;
    margin: 3px 0 3px 10px;
  }
  .el-form-item:nth-child(n + 6) {
    margin-top: 0;
  }
  .el-select.time {
    margin-left: 20px;
  }
  .el-input--suffix .el-input__inner.fanwei {
    padding-right: 30px;
    width: 30px;
  }
  .filterCondition {
    background-color: #fff;
    margin-bottom: 20px;
  }
  .check {
    margin-left: 22px;
    padding: 8px 20px;
  }
  .ell {
    overflow: hidden;
    text-overflow: ellipsis;
    white-space: nowrap;
    line-height: 1;
  }
  //分页框样式设置（避免页面被覆盖）
  .el-pagination .el-input__inner {
    width: 100px;
  }
}
</style>